<template>
  <div>
    <div class="unitManage" v-if="booleans">
      <div class="nav_left">
        <span class="tree_top" ref="treeTop"></span>
        <el-tree
          :data="treeData"
          node-key="id"
          :default-expanded-keys="expandedKeys"
          @node-click="nodeClick">
         <span class="custom-tree-node" slot-scope="{ node, data }">
            <span class="treeContent">{{ node.label }}</span>
          </span>
        </el-tree>
      </div>
      <div class="nav_right">
        <el-row style="height: 60px; line-height: 60px; border-bottom: 1px solid #ccc;margin-bottom: 20px;">
          <el-col :span="12">
            <div style="font-size: 20px;color: #000;font-weight: bold;">组织单位列表</div>
          </el-col>
          <el-col :span="12" style="padding-top: 15px">
            <div>
              <el-button style="float: right;" size="mini" type="primary" @click="getManagement()">+添加
              </el-button>
            </div>
          </el-col>
        </el-row>
        <el-table :data="tableData2" :border="true" stripe>
          <el-table-column prop="index" label="序号" sortable width="75px"></el-table-column>
          <el-table-column prop="orgname" label="组织名称" sortable></el-table-column>
          <el-table-column prop="orgcode" label="组织机构代码" sortable></el-table-column>
          <el-table-column prop="description" label="描述" sortable></el-table-column>
          <el-table-column prop="areas" label="所属区域" sortable width="150px"></el-table-column>
          <el-table-column prop="model" label="模板" sortable width="200px"></el-table-column>
          <el-table-column prop="operation" label="操作" width="180px">
            <template slot-scope="scope">
              <el-button @click="seeEvent(scope.row)" type="primary" size="small">查看</el-button>
            </template>
          </el-table-column>


        </el-table>
        <div class="current-class">
          <el-pagination v-if="paginationShow" @current-change="handleCurrentChange"
                         :current-page="currentPage4" :page-sizes="[10]" :page-size="10"
                         layout="total, sizes, prev, pager, next, jumper"
                         :total="tableData.length"></el-pagination>
          <!--@size-change="handleSizeChange"-->
        </div>
      </div>
    </div>

    <div class="upFileCss" v-if="!booleans && !showManage">
      <el-row style="height: 60px; line-height: 60px; border-bottom: 1px solid #ccc;margin-bottom: 20px;">
        <el-col :span="12">
          <div style="font-size: 20px;color: #000;font-weight: bold;">组织单位信息</div>
        </el-col>
      </el-row>
      <el-form>
        <el-row>
          <el-col :span="12">
            <div class="grid-content bg-purple-light e-height">
              <el-form-item label="组织机构名称" label-width="200px">
                <el-input v-model="ruleForm.orgname" style="width: 350px"
                          :disabled="isOrEdit"></el-input>
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="12">
            <div class="grid-content bg-purple-light e-height">
              <el-form-item label="单位代码" label-width="200px">
                <el-input v-model="ruleForm.dwcode" style="width: 350px"
                          :disabled="isOrEdit"></el-input>
              </el-form-item>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div class="grid-content bg-purple-light e-height">
              <el-form-item label="单位简称" label-width="200px">
                <el-input v-model="ruleForm.orgsname" style="width: 350px"
                          :disabled="isOrEdit"></el-input>
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="12">
            <div class="grid-content bg-purple-light e-height">
              <el-form-item label="组织机构代码" label-width="200px">
                <el-input v-model="ruleForm.orgcode" style="width: 350px"
                          :disabled="isOrEdit"></el-input>
              </el-form-item>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div class="grid-content bg-purple-light e-height">
              <el-form-item label="描述" label-width="200px">
                <el-input v-model="ruleForm.description" style="width: 350px"
                          :disabled="isOrEdit"></el-input>
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="12">
            <div class="grid-content bg-purple-light e-height">
              <el-form-item label="权限模板" label-width="200px">
                <el-select v-model="ruleForm.modelid" placeholder="" :disabled="isOrEdit">
                  <el-option
                    v-for="item in modelidOptions"
                    :key="item.modelid"
                    :label="item.modelname"
                    :value="item.modelid">
                  </el-option>
                </el-select>
              </el-form-item>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div class="grid-content bg-purple-light e-height">
              <el-form-item label="组织类型" label-width="200px">
                <el-input v-model="ruleForm.orgtypeids" style="width: 350px" disabled></el-input>
              </el-form-item>
            </div>
          </el-col>
        </el-row>
      </el-form>

      <div class="adminBox">
        <div class="adminBox_left">管理员</div>
        <div style="width: 85%;">
          <el-row text-color="#000">
            <el-col :span="20">
              <div style="margin-bottom: 10px;font-size: 14px">成员列表</div>
            </el-col>
            <el-col :span="4">
              <el-button style="margin-bottom: 10px;font-size: 14px;float: right;" size="mini"
                         type="primary" @click="adminAdd">添加
              </el-button>
            </el-col>
          </el-row>
          <el-table :data="AdminData" style="font-size: 12px;" :border="true" stripe>
            <el-table-column prop="displayname" label="管理员" sortable width="200px"></el-table-column>
            <el-table-column prop="account" label="登录账号" sortable></el-table-column>
            <el-table-column prop="phone" label="手机号" sortable></el-table-column>
            <el-table-column prop="operation" label="操作" width="180px">
              <template slot-scope="scope">
                <el-button @click="editFile(scope.row)" type="primary" size="small">查看</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <el-footer class="el_foot">
        <el-button type="primary" @click="saveManageInfo" v-if="!this.ruleForm.orgid">提交保存</el-button>
        <el-button type="primary" @click="changeManageInfo" v-if="this.ruleForm.orgid">提交更改</el-button>
        <el-button type="primary" style="margin-left: 30px;" @click="editManageInfo">编辑</el-button>
        <el-button type="primary" style="margin-left: 30px;" @click="goBackList">返回</el-button>
      </el-footer>
    </div>
    <!--管理员信息部分-->
    <div class="personalInfo" v-if="showManage">
      <a style="font-size: 14px;">个人信息</a>
      <table style="width: 100%;margin-top: 15px;" class="personalTable" cellspacing="0" cellpadding="0"
             border="0">
        <tr>
          <td>姓名</td>
          <td>{{reform.displayname}}</td>
        </tr>
        <tr>
          <td>用户姓名</td>
          <td>{{reform.account}}</td>
        </tr>
        <tr>
          <td>身份证号</td>
          <td>{{reform.sid}}</td>
        </tr>
        <tr>
          <td>性别</td>
          <td>{{reform.sex}}</td>
        </tr>
        <tr>
          <td>组织</td>
          <td>{{reform.organization}}</td>
        </tr>
        <tr>
          <td>角色分类</td>
          <td>{{reform.roleidName}}</td>
        </tr>
        <tr>
          <td>注册时间</td>
          <td>{{reform.tegtime}}</td>
        </tr>
        <tr>
          <td>描述</td>
          <td>{{reform.description}}</td>
        </tr>
        <tr>
          <td>CA等级</td>
          <td>{{reform.cacert}}</td>
        </tr>
        <tr>
          <td>邮件</td>
          <td>{{reform.email}}</td>
        </tr>
        <tr>
          <td>手机号</td>
          <td>{{reform.phone}}</td>
        </tr>
        <tr>
          <td>状态</td>
          <td>{{reform.statusName}}</td>
        </tr>
        <tr>
          <td>权限</td>
          <td v-html="reform.funcidsName"></td>
        </tr>
      </table>
      <el-footer class="el_foot">
        <el-button type="primary" style="margin-left: 30px;" @click="adminEvent">编辑</el-button>
        <el-button type="primary" style="margin-left: 30px;" @click="goBack">返回</el-button>
      </el-footer>
      <!--管理员信息编辑的弹窗-->
      <el-dialog class="new" title="编辑管理员信息" :visible.sync="dialogVisible" width="50%"
                 :before-close="handleClose" :modal-append-to-body='false'>
        <el-form ref="reformTc" :model="reformTc" :rules="reformTcRules" label-width="130px">
          <el-form-item label="姓名" prop="displayname">
            <el-input v-model="reformTc.displayname" class="inputForm" placeholder="请填写用户姓名"></el-input>
          </el-form-item>
          <el-form-item label="用户姓名" prop="account">
            <el-input v-model="reformTc.account" placeholder="请填写用户姓名" class="inputForm"></el-input>
          </el-form-item>
          <el-form-item label="身份证号">
            <el-input v-model="reformTc.sid" placeholder="请输入身份证号" class="inputForm"></el-input>
          </el-form-item>
          <el-form-item label="性别">
            <!--<el-input v-model="reformTc.sex" placeholder="请输入性别" class="inputForm"></el-input>-->

            <el-select v-model="reformTc.sex" placeholder="请输入性别" class="inputForm">
              <el-option
                v-for="item in sexBox"
                :key="item.id"
                :label="item.value"
                :value="item.id">
              </el-option>
            </el-select>

          </el-form-item>
          <el-form-item label="组织">
            <el-select v-model="reformTc.orgid" placeholder="请选择组织" class="inputForm"
                       @change="changeOrgid(reformTc.orgid)">
              <el-option
                v-for="item in orgidOptions"
                :key="item.orgid"
                :label="item.orgname"
                :value="item.orgid">
              </el-option>
            </el-select>

          </el-form-item>
          <el-form-item label="角色分类">
            <el-select v-model="reformTc.roleid" placeholder="请选择组织" class="inputForm">
              <el-option
                v-for="item in roleidBox"
                :key="item.id"
                :label="item.value"
                :value="item.id">
              </el-option>
            </el-select>

          </el-form-item>
          <el-form-item label="注册时间">
            <el-input v-model="reformTc.tegtime" placeholder="" class="inputForm" disabled></el-input>
          </el-form-item>
          <el-form-item label="描述">
            <el-input v-model="reformTc.description" placeholder="请填写描述" class="inputForm"></el-input>
          </el-form-item>
          <el-form-item label="CA等级">
            <el-input v-model="reformTc.cacert" placeholder="请填写CA等级" class="inputForm"></el-input>
          </el-form-item>
          <el-form-item label="邮件">
            <el-input v-model="reformTc.email" placeholder="请填写邮箱" class="inputForm"></el-input>
          </el-form-item>
          <el-form-item label="手机号">
            <el-input v-model="reformTc.phone" placeholder="请填写手机号" class="inputForm"></el-input>
          </el-form-item>
          <el-form-item label="状态">

            <el-select v-model="reformTc.status" placeholder="请选择组织" class="inputForm">
              <el-option
                v-for="item in statusBox"
                :key="item.id"
                :label="item.value"
                :value="item.id">
              </el-option>
            </el-select>

          </el-form-item>
          <el-form-item label="">
            <div class="qxBox">
              <div class="qxBox_left">权限</div>
              <div>
                <p style="line-height: 20px;font-size: 14px;background: rgb(148,224,255);padding: 5px">
                  系统管理权限</p>
                <el-checkbox-group v-model="checkList" @change="changeCheckList">
                  <el-checkbox label="单位管理" class="checkStyle"></el-checkbox>
                  <el-checkbox label="用户管理" class="checkStyle"></el-checkbox>
                  <el-checkbox label="个人信息" class="checkStyle"></el-checkbox>
                  <br/>
                  <el-checkbox label="审计信息" class="checkStyle"></el-checkbox>
                  <el-checkbox label="角色管理" class="checkStyle"></el-checkbox>
                  <el-checkbox label="权限管理" class="checkStyle"></el-checkbox>
                  <br/>
                  <el-checkbox label="系统设置" class="checkStyle"></el-checkbox>
                </el-checkbox-group>
              </div>
            </div>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button @click="closeReformTc">取 消</el-button>
            <el-button type="primary" @click="sureReformTc">确 定</el-button>
          </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
  import {$aos} from "../../../store/state";
  import {http} from '../../../assets/commonjs/axios';
  import {delSurplus} from '../../../assets/commonjs/utils';

  export default {
    name: "unitManage",
    data() {
      return {
        paginationShow: true,
        treeData: [],
        expandedKeys: ["02", "310110"],
        booleans: true,
        currentPage4: 1,
        tableData: [],
        tableData2: [],
        contentBox: [],
        treeNodeId: "",//保存没有子节点的节点
        childTreeNodeId: "",//用于保留当前点击的树节点（没有子节点的节点）
        // ===================== 组织单位信息内容 ===============================================================
        ruleForm: {
          // orgname: "",//组织机构名称
          // dwcode: "",//单位代码
          // orgsname:"",//单位简称
          // orgcode: "",//组织机构代码
          // description: "",//描述
          // modelid: "",//权限模板
          // orgtypeid: "",//组织类型
        },
        isOrEdit: true,//控制是否可以进行编辑
        modelidOptions: [],//模板权限的数组
        AdminData: [],//管理员的表格
        // ========================= 管理员信息展示部分==========================================================
        isAddOrEdit: true,//控制是修改还是新建
        showManage: false,//控制管理员信息展示的显示
        dialogVisible: false,//管理员信息的弹窗控制属性
        manageOrgid: "",//添加管理员时接口需要的参数（为null时是初始化的参数）
        checkList: [],
        orgidOptions: [],//组织的下拉框数据
        sexBox: [   //性别的下拉框数据
          {id: "男", value: "男"},
          {id: "女", value: "女"},
        ],
        roleidBox: [   //角色分类的下拉框数据
          {id: 0, value: "超级管理员"},
          {id: 1, value: "组织机构管理员"},
          {id: 2, value: "企业法人"},
          {id: 3, value: "专业/部门负责人"},
          {id: 4, value: "普通用户"},
          {id: 5, value: "政府部门管理员"},
          {id: 6, value: "项目负责人"},
        ],
        statusBox: [    //状态的下拉框数据
          {id: 0, value: "无效"},
          {id: 1, value: "有效"},
          {id: 2, value: "初始化"},
        ],
        reform: {
          // displayname: "",//姓名
          // account: "",//用户姓名
          // sid:"男",//身份证号码
          // sex: "",//性别
          // orgname: "",//组织
          // roleid: "",//角色分类
          // tegtime: "",//注册时间
          // description: "",//描述
          // cacert: "",//CA等级
          // email: "",//邮件
          // phone: "",//手机号
          // status: "",//状态
          // funcids: "",//权限
        },
        reformTc: {
          // displayname: "",//姓名
          // account: "",//用户姓名
          // sid:"",//身份证号码
          // sex: "",//性别
          // orgid: "",//组织
          // roleid: "",//角色分类
          // tegtime: "",//注册时间
          // description: "",//描述
          // cacert: "",//CA等级
          // email: "",//邮件
          // phone: "",//手机号
          // status: "",//状态
          // funcids: "",//权限
        },

        reformTcRules: {
          displayname: [{required: true, message: '请填写姓名', trigger: 'change'}],
          account: [{required: true, message: '请填写用户姓名', trigger: 'blur'}],
          sid: [{required: true, message: '请填写身份证号码', trigger: 'change'}],
          sex: [{required: true, message: '请填写性别', trigger: 'change'}],
          orgid: [{required: true, message: '请选择组织', trigger: 'change'}],
          roleid: [{required: true, message: '请选择角色分类', trigger: 'change'}],
          tegtime: [{required: true, message: '请填写注册时间', trigger: 'change'}],
          description: [{required: true, message: '请填写描述', trigger: 'blur'}],
          cacert: [{required: true, message: '请填写CA等级', trigger: 'blur'}],
          email: [{required: true, message: '请填写邮件', trigger: 'blur'}],
          phone: [{required: true, message: '请填写手机号', trigger: 'blur'}],
          status: [{required: true, message: '请填写状态', trigger: 'blur'}],
          funcids: [{required: true, message: '请填写联系人手机号', trigger: 'blur'}],
        },
      }
    },
    created() {
      this.getInfo();

    },
    methods: {
      nodeClick(data) {
        //===============用于强制改变页面的数字为1=========;
        this.paginationShow = false;
        this.handleCurrentChange(1);
        this.$nextTick(function () {
          this.paginationShow = true;
        })
        //===============================================;
        if (data.id) {
          let indexes = 1;
          this.tableData = []
          if (data.id != "02") {
            this.$refs.treeTop.style.zIndex = "-1"
          }
          if (data.id.length == 2) {
            for (let y = 0; y < this.contentBox.length; y++) {
              this.contentBox[y].index = indexes;
              let orgId = this.contentBox[y].orgtypeid.slice(0, 2)
              if (orgId == data.id) {
                if (data.id == "01") {
                  this.contentBox[y].areas = "上海市"
                }
                this.tableData.push(this.contentBox[y]);
                indexes++;
              }
            }
            this.treeNodeId = data.id
          } else {
            if (data.no) {
              let Qjdata = data.children
              for (let i = 0; i < Qjdata.length; i++) {
                for (let j = 0; j < this.contentBox.length; j++) {
                  if (this.contentBox[j].orgtypeid == Qjdata[i].id) {
                    this.contentBox[j].index = indexes;
                    this.tableData.push(this.contentBox[j])
                    indexes++;
                  }
                }
              }
            } else {
              for (let y = 0; y < this.contentBox.length; y++) {
                this.contentBox[y].index = indexes;
                if (this.contentBox[y].orgtypeid == data.id) {
                  this.tableData.push(this.contentBox[y]);
                  indexes++;
                }
              }
            }
          }
        }
        // 当前点击的树节点，没有子节点的保留其Id,用于当前页面可能进行的添加操作
        if (!data.children) {
          this.childTreeNodeId = data.id
        } else {
          this.childTreeNodeId = ''
        }
        this.tableData2 = this.tableData.slice(0, 10)
      },

      //获取数据
      getInfo(id) {
        http('post', 'SystemManager/GetOrgList', {
          token: $aos.token()
        }).then(require => {
          if (require.status == 200) {
            let data = require.data.orgs;
            if (data) {
              let areaObj = data.area
              this.contentBox = require.data.orgs.orgs;
              this.treeData = this.getJsonTree(data)
              if (this.treeData) {
                this.$refs.treeTop.style.zIndex = "100"
              }
              if (id) {
                this.tableData = [];
                this.tableData2 = [];
                for (let y = 0; y < this.contentBox.length; y++) {
                  if (this.contentBox[y].orgtypeid == id) {
                    this.tableData.push(this.contentBox[y])
                  }
                }
                this.tableData2 = this.tableData.slice(0, 10)
              } else {
                //初始时默认显示
                let indexs = 1;
                for (let y = 0; y < this.contentBox.length; y++) {
                  this.contentBox[y].index = indexs;
                  let orgId = this.contentBox[y].orgtypeid.slice(0, 2)
                  let areaId = this.contentBox[y].orgtypeid.slice(2, 4)
                  if (orgId == "02") {
                    for (let areaIndex in areaObj) {
                      if (areaId == areaObj[areaIndex].no) {
                        this.contentBox[y].areas = areaObj[areaIndex].name;
                        this.tableData.push(this.contentBox[y]);
                        break;
                      }
                    }
                    indexs++;
                  }
                }
                this.tableData2 = this.tableData.slice(0, 10)
              }
            } else {
              this.$message({type: 'warning', message: '登录已失效，请从新登录'});
            }

          } else {
            this.$refs.treeTop.style.zIndex = "-1"
          }
        })
      },

      //把得到的数据变成需要的树结构
      getJsonTree(data) {
        let type = data.orgtype
        let area = data.area
        let itemArr = [];//总的数组，
        let sjObj = {children: [], label: "市级", id: "01"};//市级对象，
        let qjObj = {children: [], label: "区级", id: "02"};//区级对象，
        let qtObj = {children: [], label: "其他", id: "03"};//其他对象，
        let stObj = {children: [], label: "审图公司", id: "04"};//审图公司对象，
        let qyObj = {children: [], label: "企业单位", id: "05"};//企业单位对象，
        let qjAreaIndex = ["01", "04", "05", "06", "07", "08", "09", "10", "12", "13", "14", "15", "16", "17", "18", "20", "30"];
        for (let arIndex in area) {
          let nodeA = area[arIndex];
          for (let s = 0; s < qjAreaIndex.length; s++) {
            if (qjAreaIndex[s] == nodeA.no) {
              let newArea = {};
              newArea.regionid = nodeA.regionid;
              newArea.no = nodeA.no;
              newArea.id = nodeA.code;
              newArea.label = nodeA.name;
              newArea.children = [];
              qjObj.children.push(newArea)
            }
          }
        }
        for (let index in type) {
          let node = type[index];
          let typeIndex = type[index].typeid.slice(0, 2);
          let newNode = {};
          newNode.id = node.typeid;
          newNode.label = node.orgtype;
          if (typeIndex == "01") {// 01 --市级
            sjObj.children.push(newNode);
          } else if (typeIndex == "02") { // 02 --区级
            let typeIndex2 = type[index].typeid.slice(2, 4);
            for (let chIndex in qjObj.children) {
              if (qjObj.children[chIndex].no == typeIndex2) {
                qjObj.children[chIndex].children.push(newNode)
              }
            }
          } else if (typeIndex == "03") {// 03 -- 其他
            qtObj.children.push(newNode);
          } else if (typeIndex == "04") {// 04 --审图公司
            stObj.children.push(newNode);
          } else if (typeIndex == "05") {// 05 --企业单位
            qyObj.children.push(newNode);
          }
        }
        itemArr.push(sjObj)
        itemArr.push(qjObj)
        itemArr.push(qtObj)
        itemArr.push(stObj)
        itemArr.push(qyObj)
        return itemArr;
      },
      //一页展示多少条
      // handleSizeChange(val) {
      //   this.tableData2 = this.tableData.slice((val-1)*10,val*10)
      // },
      handleCurrentChange(val) {
        this.tableData2 = this.tableData.slice((val - 1) * 10, val * 10)
      },
      //组织单位列表添加事件
      getManagement() {
        if (this.childTreeNodeId) {
          this.zhdwlbApi("0")
        } else {
          this.$message({type: 'warning', message: '无效的单位类型，请选择正确的组织机构类型，从结构树中选择叶节点，新建单位'});
        }
      },
      //组织单位列表查看
      seeEvent(row) {
        this.zhdwlbApi(row.orgid.toString())
      },

      //组织单位列表新建和查看的API:
      zhdwlbApi(orgid) {
        http('post', 'SystemManager/GetOrg', {
          orgid: orgid,
          token: $aos.token()
        }).then(require => {
          if (require.status == 200) {
            let data = require.data.org;
            this.ruleForm = data;
            this.ruleForm.orgtypeid = this.childTreeNodeId;
            this.modelidOptions = data.models;
            this.AdminData = data.orgadmin
            data.orgtypes.forEach((item) => {
              if (item.typeid == this.childTreeNodeId) {
                this.ruleForm.orgtypeids = item.orgtype
              }
            })
            this.booleans = false;
            if (orgid) {
              this.isOrEdit = true;
              this.manageOrgid = orgid
            } else {
              this.ruleForm.modelid = 1;
              this.manageOrgid = "";//初始化manageOrgid，避免创建初始化进去时可以添加管理员（初次进去时是新建的没有orgid）
            }
          }
        })
      },

      //管理员表格的添加事件
      adminAdd() {
        this.isAddOrEdit = true;
        if (this.manageOrgid) {
          this.manageEvent(this.manageOrgid.toString(), "0")
        } else {
          this.$message({type: 'warning', message: '请先把组织单位信息除管理员列表之外的内容填写并提交保存后再进行添加管理员的操作'});
        }
      },

      //管理员查看事件
      editFile(row) {
        this.isAddOrEdit = false;
        this.manageEvent("0", row.uid.toString())
      },
      //管理员添加初始化和查看API
      manageEvent(orgId, userid) {
        http('post', 'SystemManager/GetAdminUser', {
          org: orgId,
          token: $aos.token(),
          userId: userid
        }).then(require => {
          if (require.status == 200) {
            let data = require.data.AdminUser;
            this.reform = data;
            this.orgidOptions = data.orgs;
            this.orgidOptions.forEach((item) => {
              if (item.orgid == this.reform.orgid) {
                this.reform.organization = item.orgname
              }
            })
            // //转换性别
            // this.sexBox.forEach((item)=>{
            //   if(this.reform.sex == item.id){
            //     this.reform.sexName = item.value
            //   }
            // })
            //转换角色分类
            this.roleidBox.forEach((item) => {
              if (this.reform.roleid == item.id) {
                this.reform.roleidName = item.value
              }
            })
            //实时生成注册时间
            this.reform.tegtime = this.getTime()

            //状态的转换
            this.statusBox.forEach((item) => {
              if (this.reform.status == item.id) {
                this.reform.statusName = item.value
              }
            })
            //权限
            // this.checkList = this.reform.funcids
            this.getJurisdictionInfo(this.reform.funcids)
            this.showManage = true;
          }
        })
      },
      //实时生成注册时间事件
      getTime() {
        let dates = new Date();
        return `${dates.getFullYear()}年${dates.getMonth() + 1}月${dates.getDate()}日 ${dates.getHours()}:${dates.getMinutes() < 10 ? "0" + dates.getMinutes() : dates.getMinutes()}:${dates.getSeconds() < 10 ? "0" + dates.getSeconds() : dates.getSeconds()}`;
      },

      //组织单位信息提交保存事件
      saveManageInfo() {
        http('post', 'SystemManager/AddNewOrg', {
          org: this.ruleForm,
          token: $aos.token(),
        }).then(require => {
          if (require.status == 200) {
            this.booleans = true;
            this.showManage = false;
            this.expandedKeys = [this.treeNodeId, this.childTreeNodeId]
            this.getInfo(this.childTreeNodeId)
          }
        })
      },

      //组织单位信息更改后提交事件
      changeManageInfo() {
        http('post', 'SystemManager/UpdateOrg', {
          org: this.ruleForm,
          token: $aos.token(),
        }).then(require => {
          if (require.status == 200) {
            this.booleans = true;
            this.showManage = false;
            this.expandedKeys = [this.treeNodeId, this.childTreeNodeId]
            this.getInfo(this.childTreeNodeId)
          }
        })
      },
      //组织单位信息编辑事件
      editManageInfo() {
        this.isOrEdit = false;
      },
      //组织单位信息返回组织单位列表页面事件
      goBackList() {
        this.booleans = true;
        this.showManage = false;
        this.expandedKeys = [this.treeNodeId, this.childTreeNodeId]
      },


      //管理员信息编辑事件
      adminEvent() {
        this.reformTc = this.reform;
        this.dialogVisible = true
      },

      //获取权限数据用于得到数据的转换
      getJurisdictionInfo(qxData) {
        http('post', 'SystemManager/GetAllPrivilege', {
          token: $aos.token(),
        }).then(require => {
          if (require.status == 200) {
            let data = require.data.privilegelist.slice(0, qxData.length);
            let _str = '';
            data.forEach((item) => {
              this.checkList.push(item.funcname)
              _str += '<span style="display: inline-block;line-height:24px;color:#409eff;font-size:12px;min-width:50px;border:1px solid rgba(53,139,238,0.23);background:rgba(64,158,255,.1);padding:0 10px;border-radius:4px;margin:4px 5px;">' + item.funcname + '</span>';

            })
            this.reform.funcidsName = _str;
          }
        })
      },
      //实时记录组织的id(为提交之后的查询存参数)
      changeOrgid(orgid) {
        this.manageOrgid = orgid.toString();
      },

      //弹窗关闭
      handleClose(done) {
        //实时生成注册时间
        this.reform.tegtime = this.getTime()
        done();
      },

      closeReformTc() {
        //实时生成注册时间
        this.reform.tegtime = this.getTime()
        this.dialogVisible = false;
      },
      changeCheckList() {
        let str1 = this.reformTc.funcids.length
        let str2 = this.checkList.length
        if (str1 > str2) {
          this.reformTc.funcids = this.reformTc.funcids.slice(0, str1 - 1)
        } else {
          this.reformTc.funcids.push("1")
        }
      },
      sureReformTc() {
        this.reformTc.funcids = this.reformTc.funcids.join(',')
        if (this.isAddOrEdit) {
          http('post', 'SystemManager/AddNewAdmin', {
            user: this.reformTc,
            token: $aos.token(),
          }).then(require => {
            if (require.status == 200) {
              this.booleans = false;
              this.showManage = false;
              this.dialogVisible = false;
              this.zhdwlbApi(this.manageOrgid);
            }
          })
        } else {
          http('post', 'SystemManager/UpdateAdminUser', {
            user: this.reformTc,
            token: $aos.token(),
          }).then(require => {
            if (require.status == 200) {
              this.booleans = false;
              this.showManage = false;
              this.dialogVisible = false;
              this.zhdwlbApi(this.manageOrgid);
            }
          })
        }
      },
      //个人信息返回组织单位列表页面事件
      goBack() {
        this.booleans = false;
        this.showManage = false;
      }
    }
  }
</script>

<style scoped>
  .current-class {
    padding: 10px 10px;
    float: right;
  }

  .upFileCss {
    margin-bottom: 50px;
    padding: 20px;
    background: #fff;
    box-shadow: 0 0 3px #ccc;
  }

  .unitManage {
    box-shadow: 0 0 3px #ccc;
    background: #fff;
    box-sizing: padding-box;
    overflow: hidden;
  }

  .tree_top {
    width: 94%;
    height: 26px;
    background: rgba(154, 176, 212, 0.4);
    color: red;
    position: absolute;
    top: 27px;
    z-index: -1;
  }

  .nav_left {
    height: 700px;
    background: white;
    width: 280px;
    border: 0;
    float: left;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 10px;
    box-shadow: 0 0 3px #ccc;
    box-sizing: border-box;
    position: relative;
  }

  .treeContent {
    display: inline-block;
  }

  .nav_left >>> .el-tree-node:focus > .el-tree-node__content, .el-tree-node__content:hover {
    background: rgba(154, 176, 212, 0.4);
  }

  .nav_left >>> div.el-tree-node__content:hover span.treeEdit {
    display: inline-block;
  }


  .nav_right {
    height: 100%;
    float: right;
    width: calc(100% - 300px);
    overflow: auto;
    position: relative;
    box-shadow: 0 0 3px #ccc;
    border: 0;
    background: #fff;
    padding: 0 30px 20px 30px;
    box-sizing: border-box;
    margin-left: 10px;
  }

  .el_foot {
    width: 40%;
    text-align: center;
    margin: 40px auto;
  }

  .adminBox {
    display: flex;
    margin-bottom: 20px
  }

  .adminBox_left {
    width: 10%;
    align-self: center;
    text-align: center;
  }

  /*==================管理员信息展示的样式============================*/
  .personalInfo {
    box-shadow: 0 0 3px #ccc;
    padding: 20px;
    background: #fff;
    box-sizing: padding-box;
  }

  .personalTable > tr {
    transition: background-color .2s;
  }

  .personalTable > tr > td {
    height: 40px;
    box-sizing: border-box;
    border-top: 1px solid #00000017;
    border-left: 1px solid #00000017;
    word-break: break-all;
    padding: 0 20px;
    font-size: 14px;
    text-align: left;
  }

  .personalTable > tr:hover {
    background: #eeeeee;
  }

  .personalTable > tr:last-child > td {
    border-bottom: 1px solid #00000017;
  }

  .personalTable > tr > td:last-child {
    border-right: 1px solid #00000017;
  }

  .personalTable > tr > td:nth-child(1) {
    width: 150px;
  }

  .personalTable > tr > td:nth-child(3) {
    width: 150px;
  }

  /*=================  弹窗权限的样式  =======================*/
  .qxBox {
    display: flex;
    margin: 0 20px 0 -70px;
  }

  .qxBox_left {
    width: 10%;
    align-self: center;
    text-align: center;
  }

  .checkStyle {
    margin: 0 50px;
  }

  .inputForm {
    width: 80%;
  }
</style>
